<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>实习求职</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/swiper.min.css">
    <link rel="stylesheet" href="./css/jobs.css">
    <script src="./js/jquery-1.12.4.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.min.js"></script>
    <script src="./js/login.js"></script>
</head>

<body>
    <!-- 顶部 -->
    <div class="header">
        <img class="logo-l" src="./imgs/logo.png">
        <div class="topnav">
            <ul>
                <li><a href="index.html">首页</a></li>
                <li><a href="allCompete.html">竞赛汇总</a></li>
                <li><a href="joinTeam.html">组队</a></li>
                <li><a href="community.html">社区</a></li>
                <li class="on"><a href="jobs.html">实习求职</a></li>
                <li><a href="">优秀作品</a></li>
                <li><a href="">关于我们</a></li>
            </ul>
        </div>
        <!-- 搜索 -->
        <div class="search-box">
            <input id="top_search" type="search" placeholder="搜比赛或用户">
        </div>
        <!-- 头像 -->
        <div class="logoinbox" id="loginbox">
            <img class="logo" src="./imgs/logo.png">
            <span><a href="./login.html">登录</a></span>
        </div>
    </div>

    <!-- 焦点图 -->
    <div class="bann-wrap">
        <!-- Swiper -->
        <div class="swiper-container swiper-container-initialized swiper-container-horizontal">
            <div class="swiper-wrapper" style="transform: translate3d(-7732px, 0px, 0px); transition-duration: 0ms;">
                <div class="swiper-slide">
                    <a href="#"><img src="./imgs/bann2.jpg"></a>
                </div>
                <div class="swiper-slide">
                    <a href="#"><img src="./imgs/bann6.jpg"></a>
                </div>
                <div class="swiper-slide">
                    <a href="#"><img src="./imgs/bann3.jpg"></a>
                </div>
                <div class="swiper-slide swiper-slide-active">
                    <a href="#"><img src="./imgs/bann5.jpg"></a>
                </div>
            </div>

            <!-- 圆点 -->
            <div class="swiper-pagination"></div>
            <!-- 箭头 -->
            <!-- <div class="swiper-button-next swiper-button-disabled" tabindex="0" role="button" aria-label="Next slide" aria-disabled="true"></div> -->
            <!-- <div class="swiper-button-prev" tabindex="0" role="button" aria-label="Previous slide" aria-disabled="false"></div> -->
            <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
        </div>
        <script src="./js/swiper.min.js"></script>
        <script>
            $(function () {
                var swiper = new Swiper('.swiper-container', {
                    spaceBetween: 30,
                    centeredSlides: true,
                    autoplay: {
                        delay: 4000,
                        disableOnInteraction: false,
                    },
                    // 小圆点
                    // pagination: {
                    //     el: '.swiper-pagination',
                    //     clickable: true,
                    // },
                    navigation: {
                        nextEl: '.swiper-button-next',
                        prevEl: '.swiper-button-prev',
                    },
                });
            })
        </script>
    </div>

    <div class="container">

        <div class="wrap-s">
            <!-- 搜索 -->
            <div class="option">
                <select class="select" name="">
                    <option value="实习">实习</option>
                    <option value="网申">网申</option>
                    <option value="宣讲会">宣讲会</option>
                </select>
            </div>

            <div class="search-box">
                <input id="job_search" type="search" placeholder="请输入关键词">
            </div>
        </div>

        <!-- 分类 -->
        <div class="wrap-type">
            <div class="w-t-item">
                <!-- 标题 -->
                <div class="item-h">
                    <i class="i-ws"></i>
                    <p class="tit">最新网申</p>
                    <span><a href="#">更多></a></span>
                </div>
                <ul class="item-list">
                    <li>
                        <div class="l-title">
                            <p>研发技术类</p>
                            <p>海天味业</p>
                        </div>
                        <div class="btn-sq"><a href="#">立即申请</a></div>
                    </li>
                    <li>
                        <div class="l-title">
                            <p>销售主管</p>
                            <p>慧尚科技</p>
                        </div>
                        <div class="btn-sq"><a href="#">立即申请</a></div>
                    </li>
                </ul>
            </div>

            <div class="w-t-item">
                <div class="item-h">
                    <i class="i-sx"></i>
                    <p class="tit">最新实习</p>
                    <span><a href="#">更多></a></span>
                </div>
                <ul class="item-list">
                    <li>
                        <div class="l-title">
                            <p>售后实习生</p>
                            <p>广汽商贸</p>
                        </div>
                        <div class="btn-sq"><a href="#">立即申请</a></div>
                    </li>
                    <li>
                        <div class="l-title">
                            <p>财务实习生</p>
                            <p>广汽商贸</p>
                        </div>
                        <div class="btn-sq"><a href="#">立即申请</a></div>
                    </li>
                </ul>
            </div>

            <div class="w-t-item">
                <div class="item-h">
                    <i class="i-xjh"></i>
                    <p class="tit">最新空中宣讲会</p>
                    <span><a href="#">更多></a></span>
                </div>
                <ul class="item-list">
                    <li>
                        <div class="l-title">
                            <p>中国远行2020校园招聘...</p>
                            <p>
                                <span>06-08</span>
                                <span>17 : 00</span>
                            </p>
                        </div>
                        <div class="btn-sq"><a href="#">立即申请</a></div>
                    </li>
                    <li>
                        <div class="l-title">
                            <p>求职准备—如何打造个...</p>
                            <p>
                                <span>06-08</span>
                                <span>17 : 00</span>
                            </p>
                        </div>
                        <div class="btn-sq"><a href="#">立即申请</a></div>
                    </li>
                </ul>
            </div>
        </div>

    </div>
</body>

</html>